.version-header {
  margin-bottom: 2rem;
}

.version-header h1 {
  margin-bottom: 0;
}

.version-header h1 a {
  margin-bottom: 0;
  color: #424242;
}

.version-header .release-date {
  font-size: 14px;
}

.section .section:first-of-type .release-date::after {
  content: "latest release";
  color: #fff;
  background: #2ECC71;
  padding: 0 6px;
  font-size: 14px;
  font-weight: 500;
  display: inline-block;
  margin-left: 10px;
  border-radius: 2px;
}

.release {
  display: flex;
  flex-direction: row;
}

.release .notes {
  order: 0;
  max-width: 605px;
  margin-right: 40px;
}

.release .downloads {
  order: 1;
  width: 205px;
}

.note-tag {
  padding: 0 8px;
  display: inline-block;
  font-size: 14px;
  background: #F5F6F7;
}

.note-tag p {
  margin-bottom: 0;
}

.note-tag.feature {
  border-color: #7DE0A6;
}

.note-tag.fix {
  border-color: #81BFEA;
}

.note-tag.deprecation, .note-tag.breaking {
  border-color: #F29286;
}

/* specificity matters here */
@media (min-width: 1154px) {
  #content .release .tags {
    width: 100px;
    margin-left: -120px;
    float: left;
    text-align: right;
  }

  #content .release .tags li {
    display: inline-block;
    margin-bottom: 5px;
  }

  .note-tag {
    border-right: 2px solid #686868;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
  }
}

@media (max-width: 1153px) {
  #content .release .tags {
    margin-left: 0;
    margin-bottom: 10px;
  }

  #content .release .tags li {
    display: inline-block;
    margin-right: 5px;
  }

  .note-tag {
    border-bottom: 2px solid #686868;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
}

@media (max-width: 919px) {
  .release {
    flex-direction: column;
  }

  .release .notes {
    margin-right: 0;
    max-width: initial;
  }

  .release .downloads {
    width: initial;
  }

  .release .download-links {
    float: left;
    margin-right: 20px;
  }
}

/* clear dot */
.tags li:before {
  display: none;
}

.release-note {
  margin-bottom: 35px;
}

.download-links {
  margin-bottom: 25px;
}

/* specificity matters here */
#content .release .download-links ul {
  margin-left: 0;
}

/* clear dot */
.download-links li:before {
  display: none;
}

/* specificity matters here */
#content .download-links h3 {
  margin-top: 0;
  margin-bottom: 10px;
  font-weight: 500;
}

.download-links li {
  margin-bottom: 5px;
}

.download-links p {
  margin-bottom: 0;
}

.download-links .fa {
  margin-right: 5px;
  font-size: 14px;
}

#content .release h2 {
  margin-top: 10px;
}

.downloads .version-number {
  font-size: 14px;
  line-height: 14px;
  color: #686868;
  margin-left: 5px;
}

.downloads h2 {
  position: relative;
}

.downloads h2 .version-number {
  position: absolute;
  right: 0;
  bottom: 13px;
}
